<template>
  <div></div>
</template>
<script lang="ts" setup>
import { inject } from 'vue';

defineOptions({
  name: 'AcLayer'
});
const { hooks, mapInstance, AC_NAME, MARS3D_NAME, useEmitt: acUseEmitt }: any = inject('main');

const goToShenZhen = () => {
  mapInstance.value.acApi.camera.set(
    511148.105625,
    2484442.60625,
    38338.285,
    -64.99987,
    -89.999916,
    1
  );
};

acUseEmitt('AIRCITY_EVENT', async (e) => {
  if (e.eventtype === 'LeftMouseButtonClick') {
    console.log('AIRCITY_EVENT LeftMouseButtonClick e: ', e);
  } else if (e.eventtype === 'CameraStopMove') {
    console.log('AIRCITY_EVENT CameraStopMove e: ', e);
  }
});

const drawPolygon = async () => {
  mapInstance.value.acApi.polygon.clear();
  //使用PolygonStyle样式的面
  let p1 = {
    id: 'polygon1',
    coordinates: [
      [113.944899, 22.542885, 100],
      [113.944999, 22.536006, 10],
      [113.950339, 22.535932, 100],
      [113.95425, 22.542958, 100],
      [113.948947, 22.543217, 100]
    ],
    coordinateType: 1, //坐标系类型，取值范围：0为Projection类型，1为WGS84类型，2为火星坐标系(GCJ02)，3为百度坐标系(BD09)，默认值：0
    range: [1, 10000], //可视范围：[近裁距离, 远裁距离]，取值范围: [任意负值, 任意正值]
    color: [0, 0, 1, 0.8], //多边形的填充颜色
    frameColor: Color.Red, //边框颜色
    frameThickness: 5, //边框厚度
    intensity: 1, //亮度
    style: PolygonStyle.SingleColor, //单色 请参照API开发文档选取枚举
    depthTest: false //是否做深度检测 开启后会被地形高度遮挡
  };

  let pArr = [];
  pArr.push(p1);
  await mapInstance.value.acApi.polygon.add(pArr);
  mapInstance.value.acApi.polygon.focus('polygon1', 800);
};

defineExpose({
  goToShenZhen,
  drawPolygon
});
</script>
<style lang="less" scoped></style>
